<template>
	<div style="background: #fff;height: 100%;">
		<Tabs :tabs="tabsList" width="400" height="40" type="line" fontSize="16"/>
		<Tabs :tabs="tabsList" width="400" height="40" type="demo" fontSize="16"/>
		<Tabs :tabs="tabsListverticle" width="120" height="260" type="verticle" fontSize="16"/>
	</div>
</template>

<script setup>
import {watch} from 'vue'
import { useRouter } from 'vue-router';
	const tabsList=[
		{name:"苹果",icon:'ios'},
		{name:"安卓",icon:'anzhuo'},
		{name:"鸿蒙",icon:'hongmeng'}
	]
	const tabsListverticle=[
		{name:"苹果",icon:'ios'},
		{name:"安卓",icon:'anzhuo'},
		{name:"鸿蒙",icon:'hongmeng'},
		{name:"小程序",icon:'weixinxiaochengxu'},
		{name:"前端",icon:'qianduankaifa'},
		{name:"后台",icon:'houduankaifa'},
	]

	let router = useRouter()
watch(() => router,(newValue, oldValue) => {
    console.log(newValue);
},
{ immediate: true }
);
</script>

<style>
</style>